import 'package:cbec_app/components/base/base_image.dart';
import 'package:cbec_app/components/base/base_interactive.dart';
import 'package:cbec_app/utils/Tools.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

///店铺装修-热区切图
class DecorationAdHotArea extends StatefulWidget {
  ///热区配置
  final Map<String, dynamic> info;
  const DecorationAdHotArea({super.key, required this.info});

  @override
  State<StatefulWidget> createState() {
    return _DecorationAdHotAreaState();
  }
}

class _DecorationAdHotAreaState extends State<DecorationAdHotArea> {
  @override
  Widget build(BuildContext context) {
    return Container(
      margin: EdgeInsets.only(left: getMargin(), right: getMargin()),
      child: Column(
        children: (widget.info['sub_entry'] as List).map((item) => hotAreaItem(item)).toList(),
      ),
    );
  }

  ///热区item
  Widget hotAreaItem(Map<String, dynamic> item) {
    return Container(
      margin: EdgeInsets.only(
        bottom: (widget.info['border_width'] as int).toDouble(),
      ),
      width: getUseWidth(),
      child: Stack(
        children: createList(item),
      ),
    );
  }

  ///生成热区数据
  List<Widget> createList(Map<String, dynamic> item) {
    List<Widget> arr = [];
    //底图
    arr.add(BaseImage(
      url: item['image_url'],
      width: getUseWidth(),
      borderRadius: BorderRadius.all(Radius.circular(getRadius())),
    ));

    arr.add(Positioned(
      bottom: 10,
      child: SizedBox(width: ScreenUtil().screenWidth, child: Center(child: Text(item['title']))),
    ));
    //热区
    for (var child in item['hot_areas']) {
      arr.add(Positioned(
          left: (child['start_x'] as int).toDouble(),
          top: (child['start_y'] as int).toDouble(),
          child: BaseInteractive(
            childWidget: SizedBox(
              width: (child['end_x'] as int).toDouble() - (child['start_x'] as int).toDouble(),
              height: (child['end_y'] as int).toDouble() - (child['start_y'] as int).toDouble(),
            ),
            onClick: () {
              Tools.jumpPage(child);
            },
          )));
    }
    return arr;
  }

  ///获取页面间距
  double getMargin() {
    return double.parse(widget.info['page_margin'].toString());
  }

  ///获取可用宽度
  double getUseWidth() {
    return 375.w - getMargin() * 2;
  }

  ///获取图片圆角
  double getRadius() {
    return widget.info['corner_type'] == '1' ? 0.0 : 3.0;
  }
}
